<template>
	<rui-pages :bar="menu.system">
		<view class="head">
			<view class="left">
				<rui-tab></rui-tab>
			</view>
			<button class="button" form-type="submit">保存数据</button>
		</view>

		<view class="params">
			<rui-card class="input">
				<view class="params_form">
					<view class="params_form_item" v-for="(item, index) in form" :key="index">
						<view class="params_form_item_label">
							{{item.name}}
						</view>
						<view class="params_form_item_input">
							<input type="text" placeholder="请输入" v-model="item.input" />
						</view>
						<view class="params_form_item_unit">
							{{item.unit}}
						</view>
					</view>
				</view>
			</rui-card>

			<rui-card title="温度补偿">
				<view class="params_form">
					<view class="params_form_item" style="width: calc(50% - 40px);" v-for="(item, index) in temperature"
						:key="index">
						<view class="params_form_item_label">
							{{item.name}}
						</view>
						<view class="params_form_item_input">
							<input type="text" placeholder="请输入" v-model="item.input" />
						</view>
						<view class="params_form_item_unit">
							{{item.unit}}
						</view>
					</view>
				</view>
			</rui-card>
			<rui-card title="其他配置">
				<view class="params_form">
					<view class="params_form_item" style="width: calc(100% - 40px);" v-for="(item, index) in other"
						:key="index">
						<view class="params_form_item_label">
							{{item.name}}
						</view>
						<view class="params_form_item_input">
							<input type="text" placeholder="请输入" v-model="item.input" />
						</view>
						<view class="params_form_item_unit">
							{{item.unit}}
						</view>
					</view>
				</view>
			</rui-card>
		</view>
	</rui-pages>
</template>

<script setup>
	import {
		ref,
		watch
	} from 'vue';
	import menu from '@/utils/menu.js';

	let other = ref([{
		name: "自动干燥泄漏率",
		en: "inner_temperature_setter",
		unit: "Pa/s",
		input: 20
	}, {
		name: "干燥压力值",
		en: "inner_temperature_setter",
		unit: "Pa",
		input: 20
	}, {
		name: "真空保持时间",
		en: "inner_temperature_setter",
		unit: "S",
		input: 20
	}, {
		name: "新风时间",
		en: "inner_temperature_setter",
		unit: "S",
		input: 20
	}, {
		name: "蒸发器压力调整",
		en: "inner_temperature_setter",
		unit: "Pa",
		input: 20
	}, {
		name: "内胆压力调整",
		en: "inner_temperature_setter",
		unit: "Pa",
		input: 20
	}])
	let temperature = ref([{
		name: "内胆设置温度",
		en: "inner_temperature_setter",
		unit: "℃",
		input: 20
	}, {
		name: "内胆温度补偿",
		en: "inner_temperature_compensation",
		unit: "℃",
		input: 20
	}, {
		name: "蒸发室设置温度",
		en: "evaporator_temperature_setter",
		unit: "℃",
		input: 20
	}, {
		name: "蒸发室温度补偿",
		en: "evaporator_temperature_compensation",
		unit: "℃",
		input: 20
	}, {
		name: "冷凝器设置温度",
		en: "condenser_temperature_setter",
		unit: "℃",
		input: 20
	}, {
		name: "冷凝器温度补偿",
		en: "condenser_temperature_compensation",
		unit: "℃",
		input: 20
	}, {
		name: "前门设置温度",
		en: "front_temperature_setter",
		unit: "℃",
		input: 20
	}, {
		name: "前门温度补偿",
		en: "front_temperature_compensation",
		unit: "℃",
		input: 20
	}, {
		name: "后门设置温度",
		en: "after_temperature_setter",
		unit: "℃",
		input: 20
	}, {
		name: "后门温度补偿",
		en: "after_temperature_compensation",
		unit: "℃",
		input: 20
	}, {
		name: "机箱温度上限",
		en: "temperature_upper",
		unit: "℃",
		input: 20
	}])
	let form = ref([{
			name: "预真空蒸发器泄漏率",
			en: "vacuum_evaporator_leakage_rate",
			unit: "Pa/s",
			input: 20
		},
		{
			name: "预真空总时间",
			unit: "S",
			en: "vacuum_total_time",
			input: ""
		},
		{
			name: "传输时间",
			unit: "S",
			en: "transmission_time",
			input: ""
		},

		{
			name: "预真空内胆泄漏率",
			unit: "Pa/s",
			en: "vacuum_inner_leakage_rate",
			input: ""
		},
		{
			name: "预真空预热时间",
			unit: "S",
			en: "vacuum_warm_time",
			input: ""
		},
		{
			name: "等离子体总时间",
			unit: "S",
			en: "plasma_total_time",
			input: ""
		},

		{
			name: "预真空蒸发器降压值",
			unit: "Pa",
			en: "vacuum_evaporator_drop_value",
			input: ""
		},
		{
			name: "预真空等离子体",
			unit: "S",
			en: "vacuum_plasma",
			input: ""
		},
		{
			name: "等离子体降压时间",
			unit: "S",
			en: "plasma_drop_time",
			input: ""
		},

		{
			name: "预真空内胆降压值",
			unit: "Pa",
			en: "vacuum_inner_drop_value",
			input: ""
		},
		{
			name: "注液总时间",
			unit: "S",
			en: "injection_total_time",
			input: ""
		},
		{
			name: "新风时间",
			unit: "S",
			en: "fresh_air_time",
			input: ""
		},

		{
			name: "传输内胆压力差值",
			unit: "Pa",
			en: "transmission_inner_pressure_difference_value",
			input: ""
		},
		{
			name: "提纯时间",
			unit: "S",
			en: "purify_time",
			input: ""
		},
		{
			name: "真空保留时间",
			unit: "S",
			en: "vacuum_retain_time",
			input: ""
		},

		{
			name: "蒸发器降压合格压力",
			unit: "S",
			en: "evaporator_drop_qualified_pa",
			input: ""
		},
		{
			name: "提纯后降压时间",
			unit: "S",
			en: "purify_drop_time",
			input: ""
		},
		{
			name: "传输时冷凝器温度",
			unit: "℃",
			en: "transmission_condenser_temperature",
			input: ""
		},

		{
			name: "传输扩散总时间",
			unit: "S",
			en: "transmission_dispersion_total_time",
			input: ""
		},
	])


	// watch(() => form, (n, o) => {
	// 	console.log(111, form.value)
	// }, { deep: true })



	const formSubmit = (e) => {
		console.log(111, e)
	}
</script>

<style lang="scss" scoped>
	.head {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		margin-bottom: 15px;


		.left {
			width: calc(100% - 160px);
		}

		.button {
			background: var(--color);
			color: #fff;
			padding: 10px 0;
			width: fit-content;
			width: 140px;
			border-top-left-radius: 100px;
			border-bottom-left-radius: 100px;
		}
	}

	.params {
		display: grid;
		grid-template-columns: 2fr 1fr;
		gap: 15px;

		.input {
			grid-column: 1/3;
		}

		&_form {
			display: flex;
			flex-wrap: wrap;

			&_item {
				width: calc(33.3% - 40px);
				margin: 10px 30px 10px 0;
				display: flex;
				align-items: center;

				&_label {
					width: calc(100% - 120px);
					text-align: right;
				}

				&_input {
					background: var(--bg);
					margin: 0 10px;
					padding: 10px;
					width: 100px;
					border-radius: 10px;
					text-align: center;
				}

				&_unit {
					width: 30px;
				}
			}
		}
	}
</style>